<template>
	<!-- 报销单详情 报销中 已撤回 已通过 已驳回 四个状态-->
	<view class='mainbody'>
		<!-- 报销 项目 状态 金额 -->
		<view class="cardContent1">
			<view class="topBox">
				<view class="title">{{currentDate.itemName}}</view>
				<image v-if="applicationStatus==2" class='boxType' src="../../static/index/baoxiaozhong.png"></image>
				<image v-if="applicationStatus==21" class='boxType' src="../../static/index/yibohui.png"></image>
				<image v-if="applicationStatus==20" class='boxType' src="../../static/index/yitongguo.png"></image>
				<image v-if="applicationStatus==22" class='boxType' src="../../static/index/yichehui.png"></image>
			</view>
			<view class="contentBox">
				<view class="totalAtm">{{currentDate.totalAMT}}</view>
				<view class="totalUnit">报销总金额(元)</view>
				<view class="totalDetail">
					<view class="left">
						<view class="detailAtm">{{currentDate.onlineOrderAMT}}</view>
						<view class="detailUnit">线上订单</view>
					</view>
					<view class="mid">
						<view class="detailAtm">{{currentDate.addRecOrderAMT}}</view>
						<view class="detailUnit">补录订单</view>
					</view>
					<view class="right">
						<view class="detailAtm">{{currentDate.allowanceAMT}}</view>
						<view class="detailUnit">补助金额</view>
					</view>
				</view>
			</view>
		</view>

		<!-- 线上订单 -->
		<view class="title">线上订单</view>
		<view class="onlineOrderBox">
			
			<!-- 线上订单 展开-->
			<view v-if="showOrderView">
				<view class="orderItem" v-if="onlinePlaneList.length>0" v-for="(item,i) in onlinePlaneList" :key="i">
					<view class="overlineItem" v-if="item.overStandardFlag">
						<view>该订单为超标订单</view>
						<view @click="detailOverStandard()">查看</view>
					</view>
					<view class="orderTitle">
						<view class="travelType">{{formatType(item.orderType)}}</view>
						<view class="fromTo">{{item.origin}}&nbsp;-{{item.destination}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">出发时间</view>
						<view class="rightStl">{{item.departTime}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">航班</view>
						<view class="rightStl">{{item.flightNo}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">机场</view>
						<view class="rightStl">
							{{item.departAirportName}}{{item.departAirportBuilding}}-{{item.arriveAirportName}}{{item.arriveAirportBuilding}}
						</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">金额</view>
						<view class="rightStl">{{item.reimburseAmt}}元</view>
					</view>
					<view class="bottomItem">
						<view class="leftStyle">
							<view class="deductAmount">扣减金额</view>
							<image class='liebiaoIcon' src="../../static/index/liebiaolei.png" @click="prompt()">
							</image>
						</view>
						<view class="rightStyle">{{item.reduceAmt}}元</view>
					</view>
				</view>

				<view class="orderItem" v-if="onlineTrainList.length>0" v-for="(item,i) in onlineTrainList" :key="i">
					<view class="overlineItem" v-if="item.overStandardFlag">
						<view>该订单为超标订单</view>
						<view @click="detailOverStandard()">查看</view>
					</view>
					<view class="orderTitle">
						<view class="travelType">{{formatType(item.orderType)}}</view>
						<view class="fromTo">{{item.origin}}&nbsp;-{{item.destination}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">出发时间</view>
						<view class="rightStl">{{item.departureTime}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">车次</view>
						<view class="rightStl">{{item.trainNo}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">车站</view>
						<view class="rightStl">{{item.origin}}-{{item.destination}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">金额</view>
						<!-- 这个金额是报销金额还是订单金额 -->
						<view class="rightStl">{{item.reimburseAmt}}元</view>
					</view>
					<view class="bottomItem">
						<view class="leftStyle">
							<view class="deductAmount">扣减金额</view>
							<image class='liebiaoIcon' src="../../static/index/liebiaolei.png" @click="prompt()">
							</image>
						</view>
						<view class="rightStyle">{{item.reduceAmt}}元</view>
					</view>
				</view>

				<view class="orderItem" v-if="onlineHotelList.length>0" v-for="(item,i) in onlineHotelList" :key="i">
					<view class="overlineItem" v-if="item.overStandardFlag">
						<view>该订单为超标订单</view>
						<view @click="detailOverStandard()">查看</view>
					</view>
					<view class="orderTitle">
						<!-- orderStatus -->
						<view class="travelType">{{formatType(item.orderType)}}</view>
						<view class="fromTo">{{item.hotelName}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">入住时间</view>
						<view class="rightStl">{{item.checkInDate}}至{{item.checkOutDate}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">房型</view>
						<view class="rightStl">{{item.roomTypeName}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">房间数量</view>
						<view class="rightStl">{{item.roomQuantity}}间{{item.daysNo}}晚</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">金额</view>
						<view class="rightStl">{{item.reimburseAmt}}元</view>
					</view>
					<view class="bottomItem">
						<view class="leftStyle">
							<view class="deductAmount">扣减金额</view>
							<image class='liebiaoIcon' src="../../static/index/liebiaolei.png" @click="prompt()">
							</image>
						</view>
						<view class="rightStyle">{{item.reduceAmt}}元</view>
					</view>
				</view>

			</view>
			
			<view v-else>
				<!-- 线上订单 单个-->
				<view class="orderItem" v-if="onlinePlaneList.length>0">
					<view class="overlineItem" v-if="onlinePlaneList[0].overStandardFlag">
						<view>该订单为超标订单</view>
						<view @click="detailOverStandard()">查看</view>
					</view>
					<view class="orderTitle">
						<view class="travelType">{{formatType(onlinePlaneList[0].orderType)}}</view>
						<view class="fromTo">{{onlinePlaneList[0].origin}}&nbsp;-{{onlinePlaneList[0].destination}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">出发时间</view>
						<view class="rightStl">{{onlinePlaneList[0].departTime}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">航班</view>
						<view class="rightStl">{{onlinePlaneList[0].flightNo}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">机场</view>
						<view class="rightStl">
							{{onlinePlaneList[0].departAirportName}}{{onlinePlaneList[0].departAirportBuilding}}-{{onlinePlaneList[0].arriveAirportName}}{{onlinePlaneList[0].arriveAirportBuilding}}
						</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">金额</view>
						<view class="rightStl">{{onlinePlaneList[0].reimburseAmt}}元</view>
					</view>
					<view class="bottomItem">
						<view class="leftStyle">
							<view class="deductAmount">扣减金额</view>
							<image class='liebiaoIcon' src="../../static/index/liebiaolei.png" @click="prompt()"></image>
						</view>
						<view class="rightStyle">{{onlinePlaneList[0].reduceAmt}}元</view>
					</view>
				</view>
				<view class="orderItem" v-else-if="onlineTrainList.length>0">
					<view class="overlineItem" v-if="onlineTrainList[0].overStandardFlag">
						<view>该订单为超标订单</view>
						<view @click="detailOverStandard()">查看</view>
					</view>
					<view class="orderTitle">
						<view class="travelType">{{formatType(onlineTrainList[0].orderType)}}</view>
						<view class="fromTo">{{onlineTrainList[0].origin}}-{{onlineTrainList[0].destination}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">出发时间</view>
						<view class="rightStl">{{onlineTrainList[0].departureTime}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">车次</view>
						<view class="rightStl">{{onlineTrainList[0].trainNo}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">站点</view>
						<view class="rightStl">{{onlineTrainList[0].origin}}-{{onlineTrainList[0].destination}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">金额</view>
						<view class="rightStl">{{onlineTrainList[0].reimburseAmt}}元</view>
					</view>
					<view class="bottomItem">
						<view class="leftStyle">
							<view class="deductAmount">扣减金额</view>
							<image class='liebiaoIcon' src="../../static/index/liebiaolei.png" @click="prompt()"></image>
						</view>
						<view class="rightStyle">{{onlineTrainList[0].reduceAmt}}元</view>
					</view>
				</view>
				<view class="orderItem" v-else-if="onlineHotelList.length>0">
					<view class="overlineItem" v-if="onlineHotelList[0].overStandardFlag">
						<view>该订单为超标订单</view>
						<view @click="detailOverStandard()">查看</view>
					</view>
					<view class="orderTitle">
						<view class="travelType">{{formatType(onlineHotelList[0].orderType)}}</view>
						<view class="fromTo">{{onlineHotelList[0].hotelName}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">入住时间</view>
						<view class="rightStl">{{onlineHotelList[0].checkInDate}}至{{onlineHotelList[0].checkOutDate}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">房型</view>
						<view class="rightStl">{{onlineHotelList[0].roomTypeName}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">房间数量</view>
						<view class="rightStl">{{onlineHotelList[0].roomQuantity}}间{{onlineHotelList[0].daysNo}}晚</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">金额</view>
						<view class="rightStl">{{onlineHotelList[0].reimburseAmt}}元</view>
					</view>
					<view class="bottomItem">
						<view class="leftStyle">
							<view class="deductAmount">扣减金额</view>
							<image class='liebiaoIcon' src="../../static/index/liebiaolei.png" @click="prompt()"></image>
						</view>
						<view class="rightStyle">{{onlineHotelList[0].reduceAmt}}元</view>
					</view>
				</view>
				
			</view>
			<view v-if="onlinePlaneList.length>1">
				<view v-if="showOrderView==true" class="closeOrder" @click="showOrderViews(0)">
					<view class="closeFont">收起线上订单</view>
					<image class='closeIcon' src="../../static/index/toClose.png"></image>
				</view>
				<view v-if="showOrderView==false" class="closeOrder" @click="showOrderViews(1)">
					<view class="closeFont">展开线上订单</view>
					<image class='closeIcon' src="../../static/index/open.png"></image>
				</view>
			</view>
		</view>
		<!-- 补录订单 -->
		<view class="cardContent">
			<view class="title">补录订单</view>
			<view class="cardBox">
				<!-- 补录订单 展开-->
				<view v-if="showRecOrder">
					<!-- 机票 -->
					<view v-if="currentDate.addRecOrderList.otherPlaneList.length>0" v-for="(item,i) in currentDate.addRecOrderList.otherPlaneList" :key="i">
						<view class="orderItem" v-if="item.orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">机票</view>
								<image class='downIcon' src="../../static/index/more.png"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">出发时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">乘机人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">机票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view>
						<!-- 机票 退订 -->
						<view class="orderItem" v-if="item.orderType=='06'">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>机票</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{item.orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view>
					</view>
					<!-- 火车 -->
					<view v-if="currentDate.addRecOrderList.otherTrainList.length>0" v-for="(item,i) in currentDate.addRecOrderList.otherTrainList" :key="i">
						<view class="orderItem" v-if="item.orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">火车票</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(item.orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">出发时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">乘机人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">车票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view>
						<!-- 火车 退订 -->
						<view class="orderItem" v-if="item.orderType=='06'">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>火车</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(item.orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{item.orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view>
						
					</view>
					<!-- 酒店 -->
					<view v-if="currentDate.addRecOrderList.otherHotelList.length>0" v-for="(item,i) in currentDate.addRecOrderList.otherHotelList" :key="i">
						<view class="orderItem" v-if="item.orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">酒店</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(item.orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">入住时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view>
						<!-- 酒店 退订 -->
						<view class="orderItem" v-if="item.orderType=='06'">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>酒店</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(item.orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{item.orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view>
					</view>
					
					<!-- 水/公路 -->
					<view v-if="currentDate.addRecOrderList.otherOtherWaylList.length>0" v-for="(item,i) in currentDate.addRecOrderList.otherOtherWaylList" :key="i">
						<view class="orderItem" v-if="item.orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">水/公路</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(item.orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">出发时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view>
						<!-- 水/公路 退订 -->
						<view class="orderItem" v-if="item.orderType=='06'">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>水/公路</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(item.orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{item.orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view>
					</view>
					
					<!-- 其他 -->
					<view v-if="currentDate.addRecOrderList.otherlList.length>0" v-for="(item,i) in currentDate.addRecOrderList.otherlList" :key="i">
						<!-- 其他不分正常/退订 -->
						<!-- <view class="orderItem" v-if="item.orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">其他</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(item.orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">入住时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view> -->
						<!-- 其他 退订xx  v-if="item.orderType=='06'" -->
						<view class="orderItem">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>其他</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(item.orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">费用名称</view>
								<view class="rightStl">{{item.orderKindStr}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{item.orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{item.orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{item.staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{item.reimburseAmt}}元</view>
							</view>
						</view>
					</view>
					
				</view>
				
				<!-- 补录订单 单个-->
				<view v-else>
					<!-- 机票 -->
					<view v-if="currentDate.addRecOrderList.otherPlaneList.length>0">
						<view class="orderItem" v-if="currentDate.addRecOrderList.otherPlaneList[0].orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">机票</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherPlaneList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">出发时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherPlaneList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">乘机人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherPlaneList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">机票总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherPlaneList[0].reimburseAmt}}元</view>
							</view>
						</view>
						<!-- 机票 退订 -->
						<view class="orderItem" v-if="currentDate.addRecOrderList.otherPlaneList[0].orderType=='06'">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>机票</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherPlaneList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherPlaneList[0].orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherPlaneList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherPlaneList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherPlaneList[0].reimburseAmt}}元</view>
							</view>
						</view>
										
					</view>
					
					<!-- 火车 -->
					<view v-else-if="currentDate.addRecOrderList.otherTrainList.length>0">
						<view class="orderItem" v-if="currentDate.addRecOrderList.otherTrainList[0].orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">火车票</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherTrainList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">出发时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherTrainList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">乘机人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherTrainList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">机票总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherTrainList[0].reimburseAmt}}元</view>
							</view>
						</view>
						<!-- 火车 退订 -->
						<view class="orderItem" v-if="currentDate.addRecOrderList.otherTrainList[0].orderType=='06'">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>火车</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherTrainList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherTrainList[0].orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherTrainList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherTrainList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherTrainList[0].reimburseAmt}}元</view>
							</view>
						</view>
					</view>
					<!-- 酒店 -->
					<view v-else-if="currentDate.addRecOrderList.otherHotelList.length>0">
						<view class="orderItem" v-if="currentDate.addRecOrderList.otherHotelList[0].orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">酒店</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherHotelList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">入住时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherHotelList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">入住人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherHotelList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherHotelList[0].reimburseAmt}}元</view>
							</view>
						</view>
						<!-- 酒店 退订 -->
						<view class="orderItem" v-if="currentDate.addRecOrderList.otherHotelList[0].orderType=='06'">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>酒店</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherHotelList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherHotelList[0].orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherHotelList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherHotelList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherHotelList[0].reimburseAmt}}元</view>
							</view>
						</view>
					</view>
					
					<!-- 水/公路 -->
					<view v-else-if="currentDate.addRecOrderList.otherOtherWaylList.length>0">
						<view class="orderItem" v-if="currentDate.addRecOrderList.otherOtherWaylList[0].orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">水/公路</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherOtherWaylList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">出发时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherOtherWaylList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherOtherWaylList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherOtherWaylList[0].reimburseAmt}}元</view>
							</view>
						</view>
						<!-- 水/公路 退订 -->
						<view class="orderItem" v-if="currentDate.addRecOrderList.otherOtherWaylList[0].orderType=='06'">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>水/公路</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherOtherWaylList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherOtherWaylList[0].orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherOtherWaylList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherOtherWaylList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherOtherWaylList[0].reimburseAmt}}元</view>
							</view>
						</view>
					</view>
					<!-- 其他 -->
					<view v-else-if="currentDate.addRecOrderList.otherlList.length>0">
						<!-- <view class="orderItem" v-if="currentDate.addRecOrderList.otherlList[0].orderType=='04'">
							<view class="orderTitle">
								<view class="fromTo">酒店</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherlList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">入住时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherlList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">入住人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherlList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherlList[0].reimburseAmt}}元</view>
							</view>
						</view> -->
						<!-- 其他 退订xx  v-if="currentDate.addRecOrderList.otherlList[0].orderType=='06'"-->
						<view class="orderItem">
							<view class="orderTitle">
								<view class="fromTo">
									<text class="tdTitle">退订</text>
									<text>酒店</text>
								</view>
								<image class='downIcon' src="../../static/index/more.png" @click="recOrderDetail(currentDate.addRecOrderList.otherlList[0].orderId)"></image>
							</view>
							<view class="lineItem">
								<view class="leftStl">费用名称</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherlList[0].orderKindStr}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票类型</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherlList[0].orderStatus}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">开票时间</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherlList[0].orderDate}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票人员</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherlList[0].staffSelected}}</view>
							</view>
							<view class="lineItem">
								<view class="leftStl">发票总额</view>
								<view class="rightStl">{{currentDate.addRecOrderList.otherlList[0].reimburseAmt}}元</view>
							</view>
						</view>
					</view>
					
				</view>
				
				<view v-if="currentDate.addRecOrderList.otherPlaneList.length>1">
					<view v-if="showRecOrder==true" class="closeOrder" @click="showRecOrderViews(0)">
						<view class="closeFont">收起补录订单</view>
						<image class='closeIcon' src="../../static/index/toClose.png"></image>
					</view>
					<view v-if="showRecOrder==false" class="closeOrder" @click="showRecOrderViews(1)">
						<view class="closeFont">展开补录订单</view>
						<image class='closeIcon' src="../../static/index/open.png"></image>
					</view>
				</view>
			</view>
		</view>

		<!-- 补助信息 -->
		<view class="cardContent">
			<view class="title">补助信息</view>
			<view class="cardBox">
				<!-- 补助 展开 -->
				<view v-if="showAlwOrder">
					<view class="orderItem" v-for="(item,i) in currentDate.allowanceList" :key="i">
						<view class="orderTitle">
							<view class="fromTo">{{item.staffName}}({{item.cjobgradeName}})</view>
							<image v-if="item.alwType=='02'" class='downIcon' src="../../static/index/more.png" @click="detailAlw(item.alwId)"></image>
						</view>
						<!-- 通过alwType分为实时补助02 还是定额补助01，定额补助有天数 -->
						<view class="lineItem" v-if="item.alwType=='01'">
							<view class="leftStl">补助天数</view>
							<view class="rightStl">{{item.alwDays}}天</view>
						</view>
					
						<view class="lineItem">
							<view class="leftStl">伙食费补助</view>
							<view class="rightStl">{{item.alwMeal}}元</view>
						</view>
						<view class="lineItem">
							<view class="leftStl">市内交通费补助</view>
							<view class="rightStl">{{item.alwTraffic}}元</view>
						</view>
						<view class="lineItem">
							<view class="leftStl">总补助金额</view>
							<view class="rightStl">{{item.allowanceAmt}}元</view>
						</view>
					</view>
				</view>
				
				<view v-else>
					<view class="orderItem" v-if="currentDate.allowanceList.length>0">
						<view class="orderTitle">
							<view class="fromTo">{{currentDate.allowanceList[0].staffName}}({{currentDate.allowanceList[0].cjobgradeName}})</view>
							<image v-if="currentDate.allowanceList[0].alwType=='02'" class='downIcon' src="../../static/index/more.png" @click="detailAlw(currentDate.allowanceList[0].alwId)"></image>
						</view>
						<!-- 通过alwType分为实时补助02 还是定额补助01，定额补助有天数 -->
						<view class="lineItem" v-if="currentDate.allowanceList[0].alwType=='01'">
							<view class="leftStl">补助天数</view>
							<view class="rightStl">{{currentDate.allowanceList[0].alwDays}}天</view>
						</view>
					
						<view class="lineItem">
							<view class="leftStl">伙食费补助</view>
							<view class="rightStl">{{currentDate.allowanceList[0].alwMeal}}元</view>
						</view>
						<view class="lineItem">
							<view class="leftStl">市内交通费补助</view>
							<view class="rightStl">{{currentDate.allowanceList[0].alwTraffic}}元</view>
						</view>
						<view class="lineItem">
							<view class="leftStl">总补助金额</view>
							<view class="rightStl">{{currentDate.allowanceList[0].allowanceAmt}}元</view>
						</view>
					</view>
					
				</view>

				<view v-if="currentDate.allowanceList.length>1">
					<view v-if="showAlwOrder==true" class="closeOrder" @click="showAlwOrderViews(0)">
						<view class="closeFont">收起补助信息</view>
						<image class='closeIcon' src="../../static/index/toClose.png"></image>
					</view>
					<view v-if="showAlwOrder==false" class="closeOrder" @click="showAlwOrderViews(1)">
						<view class="closeFont">展开补助信息</view>
						<image class='closeIcon' src="../../static/index/open.png"></image>
					</view>
					
				</view>
			</view>
		</view>
		<!-- <view>
			<van-swipe-cell>
			  <van-card
			    num="2"
			    price="2.00"
			    desc="描述信息"
			    title="商品标题"
			    class="goods-card"
			    thumb="https://img01.yzcdn.cn/vant/cat.jpeg"
			  />
			  你好，这是个测试
			  <template #right>
			    <van-button square text="删除" type="danger" class="delete-button" />
			  </template>
			</van-swipe-cell>
		</view> -->

		<!-- 报销账户信息 -->
		<view class="cardContent">
			<view class="title">报销账户信息</view>
			<view class="cardBox">
				<view class="orderItem">
					<view class="lineItem">
						<view class="leftStl">银行卡号</view>
						<view class="rightStl">{{currentDate.bankCardInfoList[0].cardId}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">收款银行名称</view>
						<view class="rightStl">{{currentDate.bankCardInfoList[0].bankType}}</view>
					</view>
					<view class="lineItem">
						<view class="leftStl">支行信息</view>
						<view class="rightStl">{{currentDate.bankCardInfoList[0].bankInfo}}</view>
					</view>
				</view>
			</view>
		</view>

		<!-- 申请单信息 -->
		<view class="requestNote">
			<view class="requestNoteLeft">申请单信息</view>
			<image class='downIcon' src="../../static/index/more.png" @click="travelApplication()"></image>
		</view>
	
		<!-- 审批流程 -->
		<view class="approvalProcess">
			<view class="title">审批流程</view>
			<!-- 本人提交 -->
			<view v-if="applicationStatus==22">
				<view class="processMes">
					<view class="porcessItem">
						<view class="itemLeft">
							<image class="typeImg" src="../../static/index/tijiao.png" mode="aspectFit"></image>
							<view class="messView">
								<view class="nameItem">{{userName}}
									(职级)</view>
								<view class="proItem">提交申请</view>
							</view>
						</view>
					</view>
				
					<view class="porcessItem">
						<view class="itemLeft">
							<image class="typeImg" src="../../static/index/tijiao.png" mode="aspectFit"></image>
							<view class="messView">
								<view class="nameItem">{{userName}}
									(职级)</view>
								<view class="proItem">已撤回</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view v-else>
				<!-- 本人提交 -->
				<view class="processMes">
					<view class="porcessItem">
						<view class="itemLeft">
							<image class="typeImg" src="../../static/index/tijiao.png" mode="aspectFit"></image>
							<view class="messView">
								<view class="nameItem">{{currentDate.processInfoList[0].actorName}}
									({{currentDate.processInfoList[0].executorStaffLevelName}})</view>
								<view class="proItem">{{currentDate.processInfoList[0].workflowNodeExplain}}</view>
							</view>
						</view>
						<!-- <view class="itemRight">{{currentDate.processInfo[0].createDate}}</view> -->
					</view>
				</view>
				<!-- 其它人审批 -->
				<view class="processMes" v-for="(item,i) in approver" :key='i'>
					<view class="porcessItem">
						<view class="itemLeft">
							<image v-if="item.workflowNodeExplain=='审批通过'" class="typeImg"
								src="../../static/index/shenpitongguo.png" mode="aspectFit"></image>
							<image v-if="item.workflowNodeExplain=='审批驳回'||item.workflowNodeExplain=='取消申请'" class="typeImg"
								src="../../static/index/bohui.png" mode="aspectFit"></image>
							<image v-if="item.workflowNodeExplain=='审批中'" class="typeImg"
								src="../../static/index/shenpizhong.png" mode="aspectFit"></image>
							<image v-else class="typeImg" src="../../static/index/tijiao.png" mode=""></image>
							<!-- <view class="leftLine"></view> -->
							<view class="messView">
								<view class="nameItem">{{item.actorName}}</view>
								<view class="proItem">{{item.workflowNodeExplain}}</view>
								<view v-if="item.workflowNodeExplain=='取消申请'" class='cancelReason'>取消原因，我不想去了</view>
								<view v-if="item.workflowNodeExplain=='取消申请'" class="cancelLine"></view>
							</view>
						</view>
						<!-- <view class="itemRight">{{item.createDate}}</view> -->
					</view>
				</view>
			</view>
		</view>
		
		<!-- 底部按钮 -->
		<view class="bottomBtnView">
			<!-- 已通过 没有底部按钮 -->
			<view v-if="applicationStatus==21 || applicationStatus==22" class="submitBtn" @click="update()">修改</view>
			<!-- 已驳回/已撤回 可修改 -->
			<view v-if="applicationStatus==2" class="submitBtn" @click="withdraw()">撤回</view>
			<!-- 报销中 可撤回 -->
		</view>
		<view>
			<uni-popup ref="alertDialog" class="alertDialog" type="dialog">
				<uni-popup-dialog :type="msgType" confirmText="关闭" title="温馨提示" @confirm="dialogConfirm"
					@close="dialogClose">
					<view class="">扣减金额为该订单不可报销金额。</view>
					<view>实际报销金额=该订单总额-扣减金额</view>
				</uni-popup-dialog>
			</uni-popup>
		</view>
		
		<!-- 查看详情 -->
		<view>
			
		</view>
	</view>
</template>

<script>
	import {
		reimburseDetail,
		reimburseingDetail,
		withdrawReimburse
	} from "@/api/reimburseApply.js"
	export default {
		data() {
			return {
				// showDetail:false,
				appId: '',
				applicationId: '',
				travelApplicationId: '',
				taskRecordId: '',
				userName: '哈哈哈',
				// 订单详情的所有数据
				currentDate: {},
				onlineHotelList: [],
				onlineTrainList: [],
				onlinePlaneList: [],
				applicationStatus: '',
				showOrderView: false,
				showRecOrder:false,
				showAlwOrder:false,
				approver: []
			}
		},
		onLoad(option) {
			console.log('查看详情的时候从上级传过来的数据:', JSON.parse(decodeURIComponent(option.item)));
			// this.currentDate = JSON.parse(decodeURIComponent(option.item));
			let item = JSON.parse(decodeURIComponent(option.item))
			this.appId = item.travelApplicationId
			this.applicationStatus = item.applicationStatus
			this.applicationId = item.applicationId
			this.travelApplicationId = item.travelApplicationId
			this.taskRecordId = item.taskRecordId
			let params = {
				applId: this.applicationId,
				travelApplicationId: this.travelApplicationId
			}
			// console.log(this.applicationStatus);
			if (this.applicationStatus == '02') { //报销中
				// console.log(this.taskRecordId);
				params = Object.assign(params, {
					taskRecordId: this.taskRecordId
				})
				this.getReimburseDtData(params)
			} else if (this.applicationStatus == '22') { //已撤回
				this.getWithdrawData()
			} else {
				params = Object.assign(params, {
					taskRecordId: ''
				})
				this.getReimburseDtData(params)
			}

		},
		methods: {
			formatType(val){
				let types = {
					'01':'机票',
					'02':'火车票',
					'03':'酒店'
				}
				return val = types[val]
			},
			// 查看已撤回详情
			async getWithdrawData() {
				uni.showLoading({
					title:'数据正在努力的加载中...'
				})
				let params = {
					appId: this.travelApplicationId,
					queryFlag: '01'
				}
				let res = await reimburseDetail(params)
				if (res[1].respCode && res[1].respCode == 'FJKBP0000') {
					this.currentDate = res[1].data
					
					this.onlineHotelList = this.currentDate.onlineOrderList.hotelList
					this.onlineTrainList = this.currentDate.onlineOrderList.trainList
					this.onlinePlaneList = this.currentDate.onlineOrderList.planeList
					
					if(this.currentDate.processInfoList){
						this.approver = this.currentDate.processInfoList.filter((item, index) => {
							if (index > 0) {
								return this.currentDate.processInfoList
							}
						})
						// console.log('this.approver:',this.approver);
						setTimeout(()=>{
							uni.hideLoading()
						}, 500)
					}
					
				}
			},

			// 查看报销页面 除了待报销、已撤回的详情
			getReimburseDtData(params) {
				uni.showLoading({
					title:'喝口水压压惊～数据正在努力的加载中...'
				})
				this.currentDate = {}
				reimburseingDetail(params).then(res => {
					if (res[1].respCode && res[1].respCode === 'FJKBP0000') {
						this.currentDate = res[1].data
						this.approver = this.currentDate.processInfoList.filter((item, index) => {
							if (index > 0) {
								return this.currentDate.processInfoList
							}
						})
						// console.log('this.approver:',this.approver);
						this.onlineHotelList = this.currentDate.onlineOrderList.hotelList
						this.onlineTrainList = this.curressntDate.onlineOrderList.trainList
						this.onlinePlaneList = this.currentDate.onlineOrderList.planeList
						setTimeout(()=>{
							uni.hideLoading()
						},500)
					}
				})
			},
			//线上 点击展开 收起
			showOrderViews(val) {
				if (val == 1) {
					this.showOrderView = true;
				} else {
					this.showOrderView = false;
				}
			},
			// 补录 点击展开 收起
			showRecOrderViews(val){
				if(val==1){
					this.showRecOrder = true
				} else {
					this.showRecOrder = false
				}
			},
			//补助 点击展开 收起
			showAlwOrderViews(val){
				if(val==1){
					this.showAlwOrder = true
				} else {
					this.showAlwOrder = false
				}
			},
			// 调h5补录详情（查看详情）
			recOrderDetail(val){
				uni.navigateTo({
					url: `/pages/webViewh5/index?path=orderDetail?orderId=${val}`
				})
			},
			//调h5出差申请页面
			travelApplication() {
				let params =
				  "myApply?applicationId=" +
				  this.appId +
				  "&withoutApproveFlow=false&isFromReimburse=true";
				uni.navigateTo({
					url:'/pages/webViewh5/index?path=' + encodeURIComponent(params)
				})
			},
			// 查看补助详情
			detailAlw(val){
				uni.navigateTo({
					url:'/pages/travelService/reimburse/alwDetail?item='+encodeURIComponent(JSON.stringify({alwId:val}))
				})
			},
			// 查看超标订单详情
			detailOverStandard(val){
				console.log('查看超标订单详情');
			},
			//提示信息
			prompt() {
				this.$refs.alertDialog.open()
			},
			//
			dialogClose() {},
			//
			dialogConfirm() {
				console.log("点击关闭按钮！");
			},
			withdraw() {
				withdrawReimburse().then(res=>{
					if (res[1].respCode && res[1].respCode === 'FJKBP0000') {
						console.log('成功撤回');
						uni.navigateBack({
							delta:1
						})
					}
					
				})
			},
			update() {
				uni.navigateTo({
					url: "/pages/travelService/expenseWaitingDetails?item=" + encodeURIComponent(JSON.stringify({travelApplicationId: this.travelApplicationId})),
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.mainbody {
		background: #f7f7f7;
		min-height: 100%;
	}
	
	.tdTitle {
		padding: 8rpx;
		font-size: 26rpx;
		font-weight: 400;
		color: #FFA900;
		border-radius: 4rpx;
		border: 2rpx solid #FFA900;
		margin-right: 16rpx;
	}
	.orderItem {
		padding-top: 32rpx;
		border-bottom: 2rpx solid #e5e5e5;
	}
	.overlineItem{
		height: 68rpx;
		line-height: 68rpx;
		display: flex;
		justify-content: space-between;
		margin-left: -26rpx;
		padding-right: 28rpx;
		padding-left: 28rpx;
		margin-top: -30rpx;
		margin-bottom: 20rpx;
		background-color: #FDF6E6;
		color:#FFA900;
	}
	.title {
		box-sizing: border-box;
		font-size: 34rpx;
		font-weight: 500;
		color: #333;
		background: #fff;
		height: 92rpx;
		padding-top: 22rpx;
		padding-left: 32rpx;
		border-bottom: 1rpx solid #eee;
	}

	.onlineOrderBox {
		background: #fff;
		padding-left: 32rpx;

		.orderItem {
			padding-top: 32rpx;
			border-bottom: 2rpx solid #e5e5e5;
			// box-shadow: 0rpx 12rpx 24rpx 0rpx rgba(0, 0, 0, 0.08),
			// 	0rpx 3rpx 30rpx 0rpx rgba(0, 0, 0, 0.02);
			.orderTitle {
				display: flex;
				padding-bottom: 26rpx;
				padding-right: 32rpx;

				.travelType {
					padding: 8rpx;
					font-size: 26rpx;
					font-weight: 400;
					color: #FFA900;
					border-radius: 4rpx;
					border: 2rpx solid #FFA900;
					margin-right: 16rpx;
				}

				.fromTo {
					padding-top: 8rpx;
					font-size: 30rpx;
					font-weight: 500;
					color: #333333;
				}
			}

			.leftStl {
				font-size: 30rpx;
				font-weight: 400;
				color: #666666;
			}

			.rightStl {
				font-size: 30rpx;
				font-weight: 400;
				color: #333333;
			}

			.lineItem {
				display: flex;
				justify-content: space-between;
				padding-bottom: 24rpx;
				padding-right: 32rpx;
			}

			.bottomItem {
				display: flex;
				justify-content: space-between;
				padding-bottom: 24rpx;
				padding-right: 32rpx;

				.leftStyle {
					display: flex;
					align-items: center;

					.deductAmount {
						font-size: 30rpx;
						font-weight: 400;
						color: #333333;
						margin-right: 16rpx;
					}

					.liebiaoIcon {
						border: 2rpx dashed #9a9a9a;
						height: 48rpx;
						width: 48rpx;
					}
				}

				.rightStyle {
					font-size: 30rpx;
					font-weight: 400;
					color: #C4C4C4;
				}
			}
		}

		.closeOrder {
			display: flex;
			justify-content: center;
			vertical-align: baseline;
			padding-top: 30rpx;
			padding-bottom: 40rpx;
			text-align: center;

			.closeFont {
				font-size: 28rpx;
				font-weight: 400;
				color: #FFA900;
				margin-right: 8rpx;
			}

			.closeIcon {
				position: relative;
				top: 4rpx;
				height: 32rpx;
				width: 32rpx;
			}

		}
	}

	.grants {
		display: flex;
		justify-content: space-between;
		margin-top: 20rpx;
		padding: 0 32rpx;
		background-color: #fff;
		height: 90rpx;

		.greantLeft {
			height: 90rpx;
			line-height: 90rpx;
			font-size: 32rpx;
			font-weight: 500;
			color: #333333;
		}

		.greantRight {
			display: flex;
			align-items: center;

			.addGreant {
				font-size: 32rpx;
				font-weight: 400;
				color: #C4C4C4;
				margin-right: 34rpx;
			}

			.moreIcon {
				width: 16rpx;
				height: 28rpx;
			}
		}
	}

	.cardContent {
		// display: flex;
		// align-items: center;
		// justify-content: space-between;
		margin-top: 20rpx;
		background-color: #fff;
		// height:90rpx;
		.cardBox {
			// padding-top: 32rpx;
			border-bottom: 2rpx solid #e5e5e5;

			.orderTitle {
				display: flex;
				justify-content: space-between;
				padding-bottom: 26rpx;
				padding-right: 32rpx;
				padding-left: 32rpx;

				.fromTo {
					padding-top: 8rpx;
					font-size: 30rpx;
					font-weight: 500;
					color: #333333;
				}

				.downIcon {
					height: 28rpx;
					width: 16rpx;
				}
			}

			.leftStl {
				font-size: 30rpx;
				font-weight: 400;
				padding-left: 32rpx;
				color: #666666;
			}

			.rightStl {
				font-size: 30rpx;
				font-weight: 400;
				color: #333333;
			}

			.lineItem {
				display: flex;
				justify-content: space-between;
				padding-bottom: 24rpx;
				padding-right: 32rpx;
			}

			.bottomItem {
				display: flex;
				justify-content: space-between;
				padding-bottom: 24rpx;
				padding-right: 32rpx;

				.leftStyle {
					display: flex;
					align-items: center;
					padding-left: 32rpx;

					.deductAmount {
						font-size: 30rpx;
						font-weight: 400;
						color: #333333;
						margin-right: 16rpx;
					}

					.liebiaoIcon {
						border: 2rpx dashed #9a9a9a;
						height: 48rpx;
						width: 48rpx;
					}
				}

				.rightStyle {
					font-size: 30rpx;
					font-weight: 400;
					color: #C4C4C4;
				}
			}
		}

		.closeOrder {
			display: flex;
			justify-content: center;
			vertical-align: baseline;
			padding-top: 30rpx;
			padding-bottom: 40rpx;
			text-align: center;

			.closeFont {
				font-size: 28rpx;
				font-weight: 400;
				color: #FFA900;
				margin-right: 8rpx;
			}

			.closeIcon {
				position: relative;
				top: 4rpx;
				height: 32rpx;
				width: 32rpx;
			}
		}
	}

	.cardContent1 {
		background-color: #fff;
		margin-bottom: 20rpx;

		.topBox {
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 90rpx;
			border-bottom: 1rpx solid #e5e5e5;

			.boxType {
				width: 94rpx;
				height: 40rpx;
				margin-right: 20rpx;
			}
		}

		.contentBox {
			align-items: center;
			text-align: center;
			margin: 20rpx 10rpx;
			color: #333333;

			.totalAtm {
				font-size: 56rpx;
				font-weight: 600;
				color: #333333;
				line-height: 90rpx;
			}

			.totalUnit {
				font-size: 28rpx;
				color: #333333;
			}

			.totalDetail {
				display: flex;
				justify-content: space-around;
				margin-top: 40rpx;
				padding-bottom: 50rpx;

				.detailAtm {
					font-size: 36rpx;
					line-height: 60rpx;
				}

				.detailUnit {
					font-size: 28rpx;
				}
			}
		}
	}

	.requestNote {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 20rpx;
		padding: 0 32rpx;
		background-color: #fff;
		height: 90rpx;

		.requestNoteLeft {
			height: 90rpx;
			line-height: 90rpx;
			font-size: 32rpx;
			font-weight: 500;
			color: #333333;
		}

		.downIcon {
			height: 28rpx;
			width: 16rpx;
		}
	}

	.approvalProcess {
		margin-top: 20rpx;
		padding-bottom: 216rpx;
		background: #fff;

		.processMes {
			padding: 29rpx 32rpx 30rpx 32rpx;

			.porcessItem {
				display: flex;
				justify-content: space-between;

				.itemLeft {
					display: flex;

					.typeImg {
						position: relative;
						top: 8rpx;
						left: 0;
						height: 30rpx;
						width: 30rpx;
						margin-right: 8rpx;
					}

					.leftLine {
						position: relative;
						top: -80rpx;
						left: -24rpx;
						height: 73rpx;
						border-left: 1rpx solid #e5e5e5;
					}

					.messView {
						position: relative;

						.nameItem {
							height: 45rpx;
							line-height: 45rpx;
							font-size: 32rpx;
							color: #333;
						}

						.proItem {
							font-size: 26rpx;
							color: #666;
						}

						.cancelReason {
							margin-top: 16rpx;
							color: #ed3944;
							font-size: 26rpx;
						}

						.cancelLine {
							position: absolute;
							top: 50rpx;
							left: -26rpx;
							height: 73rpx;
							border-left: 1rpx solid #e5e5e5;
						}
					}
				}

				.itemRight {
					padding-top: 8rpx;
					font-size: 26rpx;
					color: #666;
				}
			}
		}
	}

	.bottomBtnView {
		position: fixed;
		bottom: 0;
		background: #fff;
		height: 154rpx;
		width: 750rpx;

		.submitBtn {
			height: 88rpx;
			line-height: 88rpx;
			text-align: center;
			font-size: 36rpx;
			font-weight: 500;
			color: #FFFFFF;
			;
			background: #FFA900;
		}
	}

	.alertDialog {
		::v-deep .uni-dialog-title {
			.uni-dialog-title-text {
				font-size: 36rpx;
				font-weight: 500;
				color: #333333;
			}
		}

		::v-deep .uni-dialog-content {
			display: block;
			font-size: 32rpx;
			font-weight: 400;
			color: #666666;
		}

		::v-deep .uni-dialog-button:first-child {
			display: none;
		}

		::v-deep .uni-border-left .uni-button-color {
			font-size: 36rpx;
			font-weight: 500;
			color: #FFA900;
		}
	}
</style>
